import React from 'react';
import { Button,Table,Modal,Input,Radio,Select,Upload,message } from 'antd';
import { inject, observer } from 'mobx-react';
const Option = Select.Option;
const RadioButton = Radio.Button;
const RadioGroup = Radio.Group;
const { TextArea } = Input;

const upload = {
    name: 'uploadFiles',
    action: window.data_url+'/developerUser/addDeveloperUserByFile.action',
    listType:'text',
    data:{uploadFiles:'MultipartFile'},
    onChange(info) {
        if (info.file.status !== 'uploading') {
            console.log(info.file, info.fileList);
        }
        if (info.file.status === 'done') {
            var res=info.file.response
            if(res.errcode==0){
                message.success(res.errormsg);
            }else{
                message.error(res.errormsg);
            }
        } else if (info.file.status === 'error') {
            message.error('文件导入失败');
        }
    }
};
@inject('transManage')
@observer
export default class ClientMatain extends React.Component {
    constructor(props) {
        super(props);

        }
    columns = [{
        title: '名称',
        dataIndex: 'name',
        key: 'name',
    }, {
        title: '编码',
        dataIndex: 'code',
        key: 'code',
    }, {
        title: '电话',
        dataIndex: 'phone',
        key: 'phone',
    },
        {
            title: '状态',
            dataIndex: 'status',
            key: 'status',
        },
        {
            title: '创建时间',
            dataIndex: 'create_time',
            key: 'create_time',
        },
        {
            title: '操作',
            key: 'action',
            render: (text, record) => {
                return (
                    <span>
                      <a href="#" onClick={this.handleDeleteUser.bind(this,text.id)}>删除</a>
                    </span>
                )}
        }];


    componentDidMount() {
        this.props.transManage.getGusseData()
        console.log(this.props.transManage.pagination)
    }
    handelTableChange(pagination, filters, sorter){
        this.props.transManage.param.pagenow=pagination.current
        this.props.transManage.pagination=pagination
        this.props.transManage.getGusseData()
    }
    showAddUserModal(){
        this.props.transManage.visible=true
    }
    handleOk(){
        this.props.transManage.addUser().then(()=>{
            this.props.transManage.visible=false
        })
        console.log(this.props.transManage.addobj)
    }
    handleCancel(){
        this.props.transManage.visible=false
    }
    handleDeleteUser(id){
        this.props.transManage.deleteUser({
            developerUserId:id
        })
    }
    render(){
        const {tableData,pagination,visible,addobj,downloadExampleFile}=this.props.transManage
        return (
            <div  style={{'height':'100%','width':'100%'}} className="p20">
                <Modal
                    title="添加用户"
                    visible={visible}
                    onOk={this.handleOk.bind(this)}
                    onCancel={this.handleCancel.bind(this)}
                    footer={[
                        <Button key="back" onClick={this.handleCancel.bind(this)}>关闭</Button>,
                        <Button key="submit" type="primary"  onClick={this.handleOk.bind(this)}>
                            提交
                        </Button>,
                    ]}
                >
                    <div style={{ marginBottom: 16 }}>
                        <Input addonBefore="用户编码" value={addobj.code} onChange={(e)=>{addobj.code=e.target.value}}/>
                    </div>
                    <div style={{ marginBottom: 16 }}>
                        <Input addonBefore="用户姓名" value={addobj.name}  onChange={(e)=>{addobj.name=e.target.value}}/>
                    </div>
                    <div style={{ marginBottom: 16 }}>
                        <Input addonBefore="用户手机号" value={addobj.phone} onChange={(e)=>{addobj.phone=e.target.value}}/>
                    </div>

                </Modal>

                <div className="htilte mb-20">
                    <h2 className="dib f18 fwb ">客户维护</h2>
                    <Upload {...upload} className="fr">
                    <Button type="primary" className='bgbtn fr'>
                        导入客户列表
                    </Button>
                    </Upload >
                    <a href={window.data_url+'/developerUser/downloadExampleFile.action'} download='down'>
                    <Button type="primary" className='bgbtn mr-20 fr'>
                        客户列表模板文件下载
                    </Button>
                    </a>
                </div>
                <Button className='mb-20' onClick={this.showAddUserModal.bind(this)}><span className="dib mr-5">+</span>添加用户</Button>
                <Table
                    columns={this.columns}
                    dataSource={tableData.slice()}
                    rowKey="id"
                    loading={false}
                    pagination={pagination}
                    onChange={this.handelTableChange.bind(this)}

                />
            </div>
        )
    }
}